﻿<UserControl x:Class="JasonTools.MonthSlider"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	xmlns:ec="clr-namespace:Microsoft.Expression.Interactivity.Core;assembly=Microsoft.Expression.Interactions" 
	xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
	FontFamily="{StaticResource PhoneFontFamilyNormal}"
	FontSize="{StaticResource PhoneFontSizeNormal}"
	Height="90" d:DesignWidth="480"
    xmlns:JasonTools="clr-namespace:JasonTools"
    mc:Ignorable="d">

    <UserControl.Resources>
        <JasonTools:DateTimeToStringConverter x:Key="DateTimeToStringConverter"/>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="MonthSliderStateGroup" ec:ExtendedVisualStateManager.UseFluidLayout="True">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.3">
                        <VisualTransition.GeneratedEasingFunction>
                            <CubicEase EasingMode="EaseInOut"/>
                        </VisualTransition.GeneratedEasingFunction>
                    </VisualTransition>
                </VisualStateGroup.Transitions>
                <VisualState x:Name="VSTPreviousMonth">
                    <Storyboard >
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="twoMonthsAgo" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="twoMonthsAgo" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="twoMonthsAgo" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="-150" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="twoMonthsAgo" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="150" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="225" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                    </Storyboard>
                </VisualState>
                <VisualState x:Name="VSTCurrentMonth"/>
                <VisualState x:Name="VSTNextMonth">
                    <Storyboard>
                        <DoubleAnimation Duration="0" To="-225" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="previousMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="-150" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="currentMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="nextMonth" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.3" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="twoMonthsLater" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="twoMonthsLater" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="0.8" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleY)" Storyboard.TargetName="twoMonthsLater" d:IsOptimized="True"/>
                        <DoubleAnimation Duration="0" To="150" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" Storyboard.TargetName="twoMonthsLater" d:IsOptimized="True"/>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <VisualStateManager.CustomVisualStateManager>
            <ec:ExtendedVisualStateManager/>
        </VisualStateManager.CustomVisualStateManager>
        <toolkit:GestureService.GestureListener>
            <toolkit:GestureListener Flick="monthSlider_Flick"/>
        </toolkit:GestureService.GestureListener>
        <Grid x:Name="grid" RenderTransformOrigin="0.5,0.5" >
            <Grid.RowDefinitions>
                <RowDefinition Height="30"/>
                <RowDefinition Height="60"/>
            </Grid.RowDefinitions>
            <TextBlock x:Name="year" Grid.Row="0" Text="{Binding Converter={StaticResource DateTimeToStringConverter}, ConverterParameter='yyyy'}" Opacity="0.7" HorizontalAlignment="Center"/>
            <Grid Grid.Row="1">
                <TextBlock x:Name="twoMonthsAgo" Text="{Binding ConverterParameter='MMMM', Converter={StaticResource DateTimeToStringConverter}}" 
									   FontSize="{StaticResource PhoneFontSizeLarge}" 
									   RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" Opacity="0">
								<TextBlock.RenderTransform>
								<CompositeTransform TranslateX="-225" ScaleX="0.5" ScaleY="0.5"/>
							</TextBlock.RenderTransform>
                </TextBlock>
                <TextBlock x:Name="previousMonth" Text="{Binding ConverterParameter='MMMM', Converter={StaticResource DateTimeToStringConverter}}" 
									   FontSize="{StaticResource PhoneFontSizeLarge}" 
									   RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" Opacity="0.3">
								<TextBlock.RenderTransform>
								<CompositeTransform TranslateX="-150" ScaleX="0.8" ScaleY="0.8"/>
							</TextBlock.RenderTransform>
                </TextBlock>
                <TextBlock x:Name="currentMonth" Text="{Binding ConverterParameter='MMMM', Converter={StaticResource DateTimeToStringConverter}}" 
									   FontSize="{StaticResource PhoneFontSizeLarge}" 
									   RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" Opacity="1">
							<TextBlock.RenderTransform>
								<CompositeTransform ScaleX="1.5" ScaleY="1.5"/>
							</TextBlock.RenderTransform>
                </TextBlock>
                <TextBlock x:Name="nextMonth" Text="{Binding ConverterParameter='MMMM', Converter={StaticResource DateTimeToStringConverter}}" 
									   FontSize="{StaticResource PhoneFontSizeLarge}" 
									   RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" Opacity="0.3">
								<TextBlock.RenderTransform>
								<CompositeTransform TranslateX="150" ScaleX="0.8" ScaleY="0.8"/>
							</TextBlock.RenderTransform>
                </TextBlock>
                <TextBlock x:Name="twoMonthsLater" Text="{Binding ConverterParameter='MMMM', Converter={StaticResource DateTimeToStringConverter}}" 
									   FontSize="{StaticResource PhoneFontSizeLarge}" 
									   RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Center" Opacity="0">
							<TextBlock.RenderTransform>
								<CompositeTransform TranslateX="225" ScaleY="0.5" ScaleX="0.5"/>
							</TextBlock.RenderTransform>
                </TextBlock>
            </Grid>
            <Rectangle Grid.Row="1" Fill="White" Opacity="0" Width="150" HorizontalAlignment="Right" MouseLeftButtonUp="nextArea_Tap"/>
            <Rectangle Grid.Row="1" Fill="White" Opacity="0" Width="150" HorizontalAlignment="Left" MouseLeftButtonUp="previousArea_Tap"/>
        </Grid>
    </Grid>
</UserControl>
